<template>
	<div class="flex justify-between align-center header">
		<view class="flex justify-start align-center">
			<image src="../../static/img/address.png" class="address-icon" mode=""></image>
			<text class="address">合肥市</text>
			<image src="../../static/img/select.png" class="select" mode=""></image>
		</view>
		<view class="search-group">
			<input type="text" value="" class="search-inp" placeholder="搜索您想要的种类" />
			<image src="../../static/img/search.png" class="search-icon" mode=""></image>
		</view>
	</div>
</template>

<script>
</script>

<style>
	.header{
		padding:0 20upx;
	}
	.address-icon{
		width: 20upx;
		height:24upx;
	}
	.address{
		font-family: PingFang-SC-Medium;
		font-size: 24upx;
		line-height:1;
		color: #333333;
		margin: 0 9upx;
	}
	.select{
		width:21upx;
		height:12upx;
	}
	
	.search-group{
		position:relative;
	}
	.search-icon {
		width:31upx;
		height:32upx;
		position:absolute;
		left:23rpx;
		top:50%;
		margin-top:-16rpx;
		z-index: 2;
	}
	.search-inp{
		width: 537upx;
		height: 54upx;
		background-color: #f8f8f8;
		border-radius: 27upx;
		border: solid 1px #e7e7e7;
		text-align: center;
		z-index: 1;
		font-family: PingFang-SC-Regular;
		font-size: 24upx;
		line-height: 54upx;
		color: #999999;
	}
</style>
